<template>
	<view class="" style="width: 100%;" @tap="open">
		<u-input readonly v-model="value1" type="select" placeholder="请选择" />
		<u-picker closeOnClickOverlay @cancel="show = false" :show="show" :columns="options" @confirm="optionClick"
			keyName="dictLabel" placeholder="请选择">
		</u-picker>
	</view>
</template>

<script>
	import {
		dictSect,
		dictFuns
	} from "@/util/dictionary.js"
	export default {
		props: ["data", "value", "dict", "keys"],
		name: "mySelect",
		data() {
			return {
				show: false,
				value1: "",
				options: []
			}
		},
		watch: {
			keys: {
				handler: function(newValue) {
					// console.log("监听keys",newValue);
				},
				immediate: true,
				deep: true,
			},
			data: {
				handler: function(newValue) {
					// console.log("监听data",newValue);
				},
				immediate: true,
				deep: true,
			},
			value: {
				handler: function(newValue) {
					// console.log("监听value",newValue);
					this.value1 = this.dictFunsF(newValue, this.dict)
				},
				immediate: true,
				deep: true,
			},
			dict: {
				handler: function(newValue) {
					// console.log("监听dict",newValue);
					this.dictfun(newValue)
				},
				immediate: true,
				deep: true,
			},

		},
		methods: {
			open() {
				this.show = true
				setTimeout(() => {
					uni.hideKeyboard()
				}, 10)
			},
			dictfun(value) {
				let array = dictSect(value)
				let arrays = []
				array.forEach(element => {
					if (element.dictValue == -1) {
				
					} else {
						arrays.push(element)
					}
				})
				this.options = []
				this.options.push(arrays)
				// console.log("下拉数据", this.options);
			},
			dictFunsF(value, res) {
				return dictFuns(value, res)
			},
			optionClick(e) {
				console.log("点击选中", e);
				this.$emit('mySelectclick', {
					value: e.value[0].dictValue,
					key: this.keys
				})
				this.show = false
			}
		}
	}
</script>

<style lang="scss">
</style>
